<template>
  <div>
    <el-card style="border-radius: 15px;padding:0 10px">
      <h3>预约信息</h3>
      <el-divider></el-divider>
      <el-descriptions :column="3" colon>
        <el-descriptions-item label="账号"> {{ bookingInfo.acc }}</el-descriptions-item>
        <el-descriptions-item label="预约教师姓名"> {{ bookingInfo.jsxm }}</el-descriptions-item>
        <el-descriptions-item label="预约日期"> {{ bookingInfo.yyrq }}</el-descriptions-item>
        <el-descriptions-item label="预约时间段">
          {{ bookingInfo.availTime.start }} - {{ bookingInfo.availTime.end }}
        </el-descriptions-item>
        <el-descriptions-item label="咨询主题类型"> {{ bookingInfo.topic.name }}</el-descriptions-item>
        <el-descriptions-item label="主题名"> {{ bookingInfo.zxzt }}</el-descriptions-item>
        <el-descriptions-item label="问题简述"> {{ bookingInfo.bz }}</el-descriptions-item>
      </el-descriptions>
    </el-card>
  </div>
</template>

<script>
export default {
  name: 'Step1',
  data () {
    return {
      bookingInfo: {
        id: '',
        acc: '',
        jsxm: '',
        yyrq: '',
        availTime: {
          id: '',
          start: '',
          end: ''
        },
        topic: {
          id: '',
          name: ''
        },
        other: '',
        zxzt: '',
        bz: ''
      }
    }
  },
  methods: {},
  mounted () {
    this.$axios.get('/student/process/' + this.$store.state.acc + '/show/booking').then(resp => {
      if (resp.data === '') {
      } else {
        this.bookingInfo = resp.data
        this.$emit('change1')
      }
    }).catch(failResponse => {
      alert('服务器响应请求失败！')
    })
  }
}
</script>

<style scoped>

</style>
